<template>
	<view class="flex-col page">
		<view class="top_search">
			<u-search placeholder="日照香炉生紫烟" v-model="searchText"></u-search>
			<!-- <view class="stj">
				<u-icon size="20" name="https://project-user-resource-1256085488.cos.ap-guangzhou.myqcloud.com/61a6df60dc329c0011115679/62b1854fc1c22a0011ec2d62/16558803711530225766.png" class=""></u-icon>
				<view class="tj">
					添加
				</view>
			</view>
			<view class="ssx">
				<u-icon size="20" name="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/61a6df60dc329c0011115679/62b1854fc1c22a0011ec2d62/16563176236757526758.png" class=""></u-icon>
				<view class="sx">
					筛选
				</view>
			</view> -->
			<!-- <form action="/">
				<van-search v-model="searchText" label="搜索" show-action placeholder="请输入搜索关键词" @search="onSearch" @cancel="onCancel" />
			</form> -->
		</view>
		<view class="grid">
			<navigator :url="item.url" class="grid-item" v-for="(item,index) in menulist" :key="index">
				<image mode="aspectFit" :src="item.icon" class="icon" />
				<view>{{item.text}}</view>
			</navigator>
		</view>

	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				value: '',
				searchText: '',
				list_bUqUbFvr: [null, null, null, null, null, null],
				menulist: [{
						icon: 'https://project-user-resource-1256085488.cos.ap-guangzhou.myqcloud.com/61a6df60dc329c0011115679/62b1854fc1c22a0011ec2d62/16563176317030846348.png',
						text: '邀请到店',
						url: '/page_admin/coach-side/coach-side'
					},
					{
						icon: 'https://project-user-resource-1256085488.cos.ap-guangzhou.myqcloud.com/61a6df60dc329c0011115679/62b1854fc1c22a0011ec2d62/16563176317059448569.png',
						text: '发送通知',
						url: '/page_admin/mobile-write-offs/mobile-write-offs'
					},
					{
						icon: 'https://project-user-resource-1256085488.cos.ap-guangzhou.myqcloud.com/61a6df60dc329c0011115679/62b1854fc1c22a0011ec2d62/16563183255822698648.png',
						text: '客户权益',
						url: '/page_admin/system-log/system-log'
					},
					{
						icon: 'https://project-user-resource-1256085488.cos.ap-guangzhou.myqcloud.com/61a6df60dc329c0011115679/62b1854fc1c22a0011ec2d62/16563183255855194829.png',
						text: '节日问候',
						url: '/'
					}
				]
			};
		},
		methods: {
			onSearch(){
			},
			onCancel(){
			}
		},
	};
</script>

<style lang="scss" scoped>
	.page {
		background-color: rgb(255, 255, 255);
		width: 100%;
		overflow-y: auto;
		height: 100%;
		.top_search {
			display:flex;
			.stj {
				display: flex;
				width: 40px;
				flex-direction: column;
				align-items: center;
				.tj {
					font-size:14px;
				}
			}
			.ssx {
				display: flex;
				width: 40px;
				flex-direction: column;
				align-items: center;
				.sx {
					font-size:14px;
				}
			}
		}
		.grid {
			margin-top: 40rpx;
			display: grid;
			grid-template-columns: repeat(4, 1fr);
			row-gap: 21rpx;

			.grid-item {
				color: rgb(51, 51, 51);
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: 500;
				display: flex;
				padding: 6.5rpx 0 15rpx;
				flex-direction: column;
				align-items: center;

				image {
					width: 96rpx;
					height: 96rpx;
					margin-bottom: 20rpx;
				}
			}
		}

	}
</style>
